<template>
	<view class="modal-black" v-if="_show">
		<u-popup mode="top" :show="_show" @close="close" @open="open" :overlayStyle="{background: 'rgba(0,0,0,0.85)'}">
			<view class="fboxCol Yend">
				<view class="space"></view>
				<view class="head-action-more">
					<view class="arrow"></view>
					<view class="fboxCol action-list">
						<view class="action-item fboxRow Ycenter font28" v-for="(item, index) in list" :key="index" @click="actionTap(item, index)">
						<text class="bwfont" :class="item.icon"></text>
						{{item.label}}</view>
					</view>
				</view>	
			</view>
		</u-popup>
	</view>
</template>

<script>
	export default {
		props: {
			show:{
				type: Boolean,
				default: false
			},
			list:{
				type:Array,
				defautl:()=>{
					return []
				}
			}
		},
		data() {
			return {
				statusBarHeight: 0,
			}
		},
		computed:{
			_show:{
				get(){
					return this.show
				},
				set(val){
					this.$emit('update:show',val)
				}
			}
		},
		created() {
			this.statusBarHeight = getApp().globalData.statusBarHeight
			if (!getApp().globalData.statusBarHeight) {
				const sys = uni.getSystemInfoSync();
				console.log('111');
				this.statusBarHeight = sys.statusBarHeight
			}
			console.log('statusBarHeight',this.statusBarHeight)
		},
		mounted(){
			
		},
		methods: {
			close(){
				this._show = false
			},
			open(){
				
			},
			actionTap(item, index){
				this.close()
				const obj = {item, index}
				this.$emit('action',obj)
			}
		}
	}
</script>

<style lang="scss" scoped>
	
	.modal-black /deep/ .u-popup__content{background: none !important;}
	.space{height: 88rpx;width: 88rpx;}
	.head-action-more{position: relative;padding: 0 20rpx;}
	// .arrow{position:absolute;top: -20rpx;right: 40rpx;border: 10rpx solid transparent; border-bottom: 10rpx solid #abcdef;}
	.action-list{padding: 8rpx 0; min-width: 258rpx; background-color:var(--popupBackColor);border-radius: 12rpx;}
	.action-item{ padding: 18rpx 22rpx; line-height: 40rpx;}
	.action-item .bwfont{margin-right: 16rpx;font-size: 28rpx;}
</style>